<!DOCTYPE html>
<html class="am-touch js cssanimations">
<head>
    <meta charset="utf-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
    <title>提交订单页（团购）</title>
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no" />
    <meta name="renderer" content="webkit" />
    <link rel="icon" type="image/png" href="../assets/i/favicon.png" />
    <link rel="stylesheet" href="../assets/css/amazeui.min.css" />
    <link rel="stylesheet" href="../assets/css/app2.css" />
    <style type="text/css">
        .am-paragraph-default p.am-fr2{text-align:right !important; padding-right:15px;font-size: 1.6rem;margin: 5px 0 0 0 !important;color: #f1665d !important;}
        .am-paragraph-default p.am-fr2 s{font-size: 1.2rem;color: #333333;margin-right: 5px;}
        .listBtn p{color: #333333 !important;}
        .am-paragraph-default img{border: none;max-width: 40%;margin: 0 10px 0 0 !important;display: inline-block;}
        .interpret{text-align: right;}
        .am-topbar-fixed-bottom{text-align: center;}
    </style>
</head>
<body>
<nav class="kuaikuai-header clearfix">
    <section class="kuaikuai-product">
        <article class="am-paragraph am-paragraph-default">
            <h3 class="am-text-sm am-u-sm-8 username">快快极致打蜡洗车</h3>
            <hr class="am-divider am-divider-default">
            <p class="am-u-sm-12" style="font-size: 1.8rem;color: #f1665d;font-weight: bold;">480元<s style="font-size: 1.2rem;color: #808080;display: inline-block;margin-left: 5px;">688元</s></p>
        </article>
    </section>
</nav>

<nav class="kuaikuai-header clearfix">
    <section class="kuaikuai-product listBtn">
        <article class="am-paragraph am-paragraph-default">
            <p class="am-text-sm am-u-sm-8 username">可使用10元代金券</p>
            <p class="interpret am-u-sm-4"><a class="sel-btn"><img src="../assets/i/no-btn.png" /></a></p>

            <hr class="am-divider am-divider-default">
            <p class="am-text-sm am-u-sm-8 username">订单总价：</p>
            <p class="am-fr2 am-u-sm-4">380元</p>
        </article>
    </section>
</nav>

<section class="kuaikuai-btn2 am-topbar-fixed-bottom" style="height: 75px;">
    <button type="submit" class="btn am-btn am-btn-danger am-btn-lg am-btn-buy">提交订单</button>
</section>

<script src="../assets/js/jquery.min.js" type="text/javascript"></script>
<script src="../assets/js/amazeui.js" type="text/javascript"></script>
<script type="text/javascript">
    $(function() {
        toggleButton();
        $('.kuaikuai-btn2 button').on('click', function() {
            window.location.href = 'orderPay.html';
        });
    });

    /**
     * 按钮切换
     * */
    function toggleButton() {
        var selBtnNum = $('.sel-btn').length;

        for(var i = 0; i < selBtnNum; i++) {
            $($('.sel-btn')[i]).on('click', function() {
                if ($(this).hasClass('ok')) {
                    $(this).find('img').attr("src", "../assets/i/no-btn.png");
                    $(this).removeClass('ok');
                } else {
                    $(this).find('img').attr("src", "../assets/i/ok-btn.png");
                    $(this).addClass('ok');
                }
            });
        }
    }
</script>
</body>
</html>